<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--个人情况中的个人资料-->
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/Yhmain.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="css/other.css" />
<script type="text/javascript" src="js/jquery.min.js"></script> 
<script type="text/javascript" src="js/cityLink.js"></script>
<script src="js/birthday.js"></script>
<title>智行校园-精准化服务平台</title>
<style>
  select {
    width: 20%;
  }
</style>
</head>
<body >
<input id="the_value" value="个人资料" style="display:none"/>

    <div class="container" style="height:100%;min-width:50em;">
        <!--内容-右边容器-->
    	<div class="col-2 leftcol the_lcontainer"></div>
        <div class="col-8 text-left bg-color-white" style="height:100%;padding-bottom:1.5em">
        	<div class="pl40 pr120">
            	<div class="lineaH60 ">
            		<h3>个人资料</h3>
            	</div>
                <div class="ml70 mt20">
                	<form action="" method="post" target="hidden_frame" enctype="multipart/form-data">
                	<input name="userid" value="" style="display:none"/>
                	<a class="float-l mt10">&nbsp&nbsp个人头像 ：</a>
                    <div class="float-l container_headerPmin fileInputContainer ml20" style="position:relative;border:1px solid #b7b6b6;height:100px">
                     	<div  id="localImag" class=" text-center in-block " style="width:100%;text-decoration:none;font-size:12px;height:7em">
                     	<img src="img/girls.jpg" style="width:100%;"/></div>
                     	<span style="color: white;font-size: 0.8em;left: 0;position: absolute;text-align: center;top: 81%;width: 100%;background:#2290c3;height:20px;line-height:20px;">编辑图片</span>
                		<input name="myFile" type="file" id="doc" class="position-absolute-b fileInput" style="top:81%"/>
                    </div>
                   <div class="clear-b pt20">
	                   <div class="grxx">
	                   		<a><span class="color-red">*</span> 昵&nbsp&nbsp&nbsp称 ：</a>
	                   		<a><input type="text" value="" name="petname"/></a>
	                   </div>
	                   <div class="grxx">
	                        <a>手机号码 ：</a>
	                        <a><input type="text" value="" class="mt20" name="tel_number"/></a>
	                   </div>
                   	   <div class="grxx">
                   	        <a>真实姓名 ：</a>
                   	        <a><input type="text" value="" class="mt20" name="username"/></a>
                   	   </div>
                   	   <div class="grxx">
                   	        <a><span class="color-red">*</span> 性&nbsp&nbsp&nbsp别 ： </a>
                   	        <a>
	                   	        <input type="radio" value="男" name="sex" class="mt20" checked="checked" />男
	                   		    <input type="radio" value="女" name="sex" class="mt20"/>女</br>

                   		    </a>
                   	   </div>
                   	   <div class="grxx mt20">
                   	        <a>生&nbsp&nbsp&nbsp&nbsp日 ：</a>
                   	        <a>
                   	            <!-- <input type="text" value="男" name="sex" class="mt20" checked="checked" /> -->
                   	            <select class="sel_year" rel="2000" style="width:100px" name="yearofbirth"> </select>
		                        <select class="sel_month" rel="2" style="width:50px" name="monthofbirth"> </select> 
		                        <select class="sel_day" rel="14" style="width:50px" name="dayofbirth"> </select>

		                    </a>
                   	   </div>
                   	   <div class="grxx">
                   	        <a>星&nbsp&nbsp&nbsp&nbsp座 ：</a>
                   	        <a>
                   	            <select class="mt20  constellation" name="constellation">
		                   			<option value="白羊座">白羊座</option>
		                   			<option value="金牛座">金牛座</option>
		                   			<option value="双子座">双子座</option>
		                   			<option value="巨蟹座">巨蟹座</option>
		                   			<option value="狮子座">狮子座</option>
		                   			<option value="处女座">处女座</option>
		                   			<option value="天秤座">天秤座</option>
		                   			<option value="天蝎座">天蝎座</option>
		                   			<option value="射手座">射手座</option>
		                   			<option value="摩羯座">摩羯座</option>
		                   			<option value="水瓶座">水瓶座</option>
		                   			<option value="双鱼座">双鱼座</option>



		                   		</select>
                   	        </a>
                   	   </div>
                   	   <div class="grxx">
                   	   		<a>血&nbsp&nbsp&nbsp&nbsp型 ：</a>
                   	   		<a>
	                   	   		<select class="mt20" name="boold_type">
		                   			<option value="A型">A型</option>
		                   			<option value="B型">B型</option>
		                   			<option value="AB型">AB型</option>
		                   			<option value="O型">O型</option>
		                   			<option value="RH阴型">RH阴型</option>


                   				</select>
                   				</a>
                   	   </div>
                   	   <div class="grxx">
	                   	    <a>居住地址 ：</a>
	                   	    <a>
	                   	        <select class="mt20" id="s0" name="living_provinces" ></select>

		                   		<select class="mt20" id="s1" name="living_municipality"></select>


		                   		<select class="mt20" id="s2" name="living_district"></select>



	                   	    </a>
                   	   </div>
                   	    <div class="grxx">
	                   	    <a>家&nbsp&nbsp&nbsp&nbsp乡 ：</a>
	                   	    <a>
			                   	<select class="mt20" id="y0" name="household_registration_provinc">


		                   		</select>
		                   		<select class="mt20"  id="y1" name="household_registration_municip">


		                   		</select>
		                   		<select class="mt20" id="y2" name="household_registration_distric">


		                   		</select>
		                    </a>
                   	   </div>
                   		<div class="mt20" style="padding-left:200px;">
                   			<input type="submit" class=" bg-color-blue color-white" style="border:0;padding:5px 20px;border-radius:5px;" value="保存"></input>
                   		</div>
                   </div>
                    </form>
                </div>
              </div>
    	</div>
    	<div class="clear-b"></div>
    	</div>
    	<iframe name='hidden_frame' id="hidden_frame" style="display:none"></iframe>   
<script>

var s=["s0","s1","s2"];
var y=["y0","y1","y2"];
var opt0 = [];  
var opt1 = [];  
var province1="--请选择省--";
var municipality1="--请选择市--";
var district1="--请选择区--";
var province2="--请选择省--";
var municipality2="--请选择市--";
var district2="--请选择区--";
var yearofbirth
var dsy = new Dsy();
dsy.addAll();
var user_name = '<%=session.getAttribute("username")%>';
var user_id = '<%=session.getAttribute("userid")%>';
var ticket = '<%=session.getAttribute("ticket")%>';
var faceaddress = '<%=session.getAttribute("faceaddress")%>';
$('input[name=userid]').attr('value',user_id);
$('input#userid').attr('value',user_id);
function setdata(the_data,data){
	if(the_data!='null')
		return the_data;
	else
		return  data;
};
</script>
<script type="text/javascript" src="js/header.js"></script>
<script type="text/javascript" src="js/leftcol.js"></script>
<script>
$.getJSON('/WDDXSERVER/login/getSTUDENTDATA',{userid:user_id,ticket:ticket},function(data){
	 province1=setdata(data.living_provinces,"--请选择省--");
	 municipality1=setdata(data.living_municipality,"--请选择市--");
	 district1=setdata(data.living_district,"--请选择区--");
	 province2=setdata(data.household_registration_provinc,"--请选择省--");
	 municipality2=setdata(data.household_registration_municip,"--请选择市--");
	 district2=setdata(data.household_registration_distric,"--请选择区--");
	 opt0 = [province1,municipality1,district1];  
     opt1 = [province2,municipality2,district2];  
	 setup();
	$('div.fileInputContainer').find('img').attr('src',data.faceaddress);
	$('input[name=petname]').attr('value',data.petname);
	$('input[name=tel_number]').attr('value',data.tel_number);
	$('input[name=username]').attr('value',data.username);
	
	$('input[value='+data.sex+']').attr('checked','checked');
	$('select.sel_year option[value='+data.yearofbirth+']').attr('selected','selected');
	$('select.sel_month option[value='+data.monthofbirth+']').attr('selected','selected');
	$('select.sel_day option[value='+data.dayofbirth+']').attr('selected','selected');
    $('select.constellation option[value='+data.constellation+']').attr('selected','selected');
	$('select[name=boold_type] option[value='+data.boold_type+']').attr('selected','selected');
});
$('input[type=submit]').click(function(){
	 $(this).parents('form').attr('enctype','application/x-www-form-urlencoded');
	 $(this).parents('form').attr('action','/WDDXSERVER/login/updatestudentdata?ticket='+ticket);
	 $(this).parents('form').submit();
});
$('select.sel_month,select.sel_day').change(function(){
	   var the_month=$('select.sel_month').find('option:selected').val();
	   var the_day=$('select.sel_day').find('option:selected').val();
	   console.log(the_month);
	   if(the_month!=''&&the_day!=''){
		   switch(the_month){
			   case '1':{
				   if(the_day<21 && the_day>0)
					   $('select.constellation option:contains(摩羯)').attr('selected','selected');
				   if(the_day<32 && the_day>20)
					   $('select.constellation option:contains(水瓶)').attr('selected','selected');
				   break;
			   }
			   case '2':{
				   if(the_day<20 && the_day>0)
					   $('select.constellation option:contains(水瓶)').attr('selected','selected');
				   if(the_day<31 && the_day>19)
					   $('select.constellation option:contains(双鱼)').attr('selected','selected');
				   break;
			   }
			   case '3':{
				   if(the_day<21 && the_day>0)
					   $('select.constellation option:contains(双鱼)').attr('selected','selected');
				   if(the_day<32 && the_day>20)
					   $('select.constellation option:contains(白羊)').attr('selected','selected');
				   break;
			   }
			   case '4':{
				   if(the_day<21 && the_day>0)
					   $('select.constellation option:contains(白羊)').attr('selected','selected');
				   if(the_day<31 && the_day>20)
					   $('select.constellation option:contains(金牛)').attr('selected','selected');
				   break;
			   }
			   case '5':{
				   if(the_day<22 && the_day>0)
					   $('select.constellation option:contains(金牛)').attr('selected','selected');
				   if(the_day<32 && the_day>21)
					   $('select.constellation option:contains(双子)').attr('selected','selected');
				   break;
			   }
			   case '6':{
				   if(the_day<22 && the_day>0)
					   $('select.constellation option:contains(双子)').attr('selected','selected');
				   if(the_day<31 && the_day>21)
					   $('select.constellation option:contains(巨蟹)').attr('selected','selected');
				   break;
			   }
			   case '7':{
				   if(the_day<23 && the_day>0)
					   $('select.constellation option:contains(巨蟹)').attr('selected','selected');
				   if(the_day<32 && the_day>22)
					   $('select.constellation option:contains(狮子)').attr('selected','selected');
				   break;
			   }
			   case '8':{
				   if(the_day<24 && the_day>0)
					   $('select.constellation option:contains(狮子)').attr('selected','selected');
				   if(the_day<32 && the_day>23)
					   $('select.constellation option:contains(处女)').attr('selected','selected');
				   break;
			   }
			   case '9':{
				   if(the_day<24 && the_day>0)
					   $('select.constellation option:contains(处女)').attr('selected','selected');
				   if(the_day<31 && the_day>23)
					   $('select.constellation option:contains(天枰)').attr('selected','selected');
				   break;
			   }
			   case '10':{
				   if(the_day<24 && the_day>0)
					   $('select.constellation option:contains(天枰)').attr('selected','selected');
				   if(the_day<32 && the_day>23)
					   $('select.constellation option:contains(天蝎)').attr('selected','selected');
				   break;
			   }
			   case '11':{
				   if(the_day<23 && the_day>0)
					   $('select.constellation option:contains(天蝎)').attr('selected','selected');
				   if(the_day<31 && the_day>22)
					   $('select.constellation option:contains(射手)').attr('selected','selected');
				   break;
			   }
			   case '12':{
				   if(the_day<21 && the_day>0)
					   $('select.constellation option:contains(射手)').attr('selected','selected');
				   if(the_day<32 && the_day>20)
					   $('select.constellation option:contains(摩羯 )').attr('selected','selected');
				   break;
			   }
		   }
	   }
		   
});
$('input#doc').change(function(){
	   var docObj=$("#doc");
	   var imgObjPreview=$('div.fileInputContainer').find('img');
	   if(docObj[0].files &&docObj[0].files[0])
	   {
	     //火狐下，直接设img属性
	     
	     //imgObjPreview.src = docObj.files[0].getAsDataURL();
	 
	     //火狐7以上版本不能用上面的getAsDataURL()方式获取，需要一下方式
	       imgObjPreview.attr('src', window.URL.createObjectURL(docObj[0].files[0]));
	       $('div.header img.header-Hammer-center').attr('src', window.URL.createObjectURL(docObj[0].files[0]));
	       $('div.container-maxtx  img').attr('src', window.URL.createObjectURL(docObj[0].files[0]));
	    }
	   else
	   {
	      //IE下，使用滤镜
	       docObj.select();
	       docObj.blur();
	       var imgSrc = document.selection.createRange().text;
	       var localImagId = $("#localImag");
	       var localImagId1=$("div.header-Hammer-center");
	       var localImagId2=$('div.container-maxtx');
	      //必须设置初始大小
	       localImagId.attr('width','100%');
	       localImagId.attr('height','7em');
	      //图片异常的捕捉，防止用户修改后缀来伪造图片
	        try{
	        	localImagId[0].style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
	        	localImagId[0].filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
	        	localImagId1[0].style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
	        	localImagId2[0].style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
	  	        localImagId1[0].filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
	  	        localImagId2[0].filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
	       }
	       catch(e)
	       {
	          alert("您上传的图片格式不正确，请重新选择!");
	        
	        }
	      imgObjPreview.css('display','none');
	      localImagId1.find('img').css('display','none');
	      localImagId2.find('img').css('display','none');
	      document.selection.empty();
	     }
	    $(this).parents('form').attr('enctype','multipart/form-data');
	    $(this).parents('form').attr('action','/WDDXSERVER/utils/localUpload?ticket='+ ticket);
	    $(this).parents('form').submit();
	    
	 });
function change(v){
	 var str="0";   
				    for(i=0;i<v;i++)  
				    {  
				        str+=("_"+(document.getElementById(s[i]).selectedIndex-1));  
				    }   
				    var ss=document.getElementById(s[v]); 
				    with(ss){   
				        length = 0;   
				        options[0]=new Option(opt0[v],opt0[v],"false","false");
				        if(v && document.getElementById(s[v-1]).selectedIndex>0 || !v)   
				        {   
				            if(dsy.Exists(str))  
				            {   
				                ar = dsy.Items[str];   
				                for(i=0;i<ar.length;i++)  
				                    options[length]=new Option(ar[i],ar[i]);   
				                if(v)  
				                    options[1].selected = true;   
				            }   
				        }   
				        if(++v<s.length)  
				        {  
				        change(v);  
				        }   
				    } 
				  
			}
function changey(v){
 	var str="0";   
				    for(i=0;i<v;i++)  
				    {  
				        str+=("_"+(document.getElementById(y[i]).selectedIndex-1));  
				    }   
				    var ss=document.getElementById(y[v]); 
				    with(ss){   
				        length = 0;   
				        options[0]=new Option(opt1[v],opt1[v]);   
				        if(v && document.getElementById(y[v-1]).selectedIndex>0 || !v)   
				        {   
				            if(dsy.Exists(str))  
				            {   
				                ar = dsy.Items[str];   
				                for(i=0;i<ar.length;i++)  
				                    options[length]=new Option(ar[i],ar[i]);   
				                if(v)  
				                    options[1].selected = true;   
				            }   
				        }   
				        if(++v<y.length)  
				        {  
				        changey(v);  
				        }   
				    }   
				 
}
function setup(opt)   
{   
	$.ms_DatePicker({ 
	    YearSelector: ".sel_year", 
	    MonthSelector: ".sel_month", 
	    DaySelector: ".sel_day" 
	}); 
    for(i=0;i<s.length-1;i++)   
        document.getElementById(s[i]).onchange=new Function("change("+(i+1)+")"); 
    for(i=0;i<y.length-1;i++)   
        document.getElementById(y[i]).onchange=new Function("changey("+(i+1)+")"); 
       change(0);
       changey(0);
}

</script>

</body>
</html>
